<template>
	<view class="bz p-2">
		<view class="bz p-2 bg-white b-radius2 d-flex flex-nowrap a-center" @click="navTo('/pages/shop/address/address')">
			<view class="flex-1">
				<view class="top_list">收货人: 暂无信息</view>
				<view class="top_list">收货地址: 暂无信息</view>
			</view>
			<image src="/static/3.png" class="c_right" mode=""></image>
		</view>
		
		<!-- 商品信息 -->
		<view class="bz p-2 bg-white b-radius2 my-2">
			<view class="py-2 d-flex flex-nowrap a-center good_list" v-for="(item,index) in 3" :key="index">
				<image src="/static/2.png" class="imgs" mode=""></image>
				<view class="px-2 flex-1">
					<view class="good_name">肌活力保健膏</view>
					<view class="num">x1</view>
				</view>
				<view class="price">￥299.00</view>
			</view>
			<view class="py-2 foot">合计: ￥299.00</view>
		</view>
		
		<view class="bz p-2 bg-white b-radius2">
			<view class="d-flex flex-nowrap a-center j-sb pt-1">
				<view class="title">是否开具发票</view>
				<switch checked="true" @change="" />
			</view>
			<view class="d-flex flex-nowrap a-center j-sb py-2" @click="navTo('/pages/shop/invoice/invoice')">
				<view class="titles">开具发票</view>
				<image src="/static/3.png" class="c_right" mode=""></image>
			</view>
		</view>
		<view class="bz p-2 bg-white b-radius2 mt-2">
			<view class="d-flex flex-nowrap a-center j-sb py-1">
				<view class="title">是否开具发票</view>
				<switch checked="true" @change="" />
			</view>
			<view class="d-flex flex-nowrap a-center j-sb">
				<view class="des_title">
					邮箱地址
				</view>
				<input type="text" placeholder="请输入电子邮箱" class="input" />
			</view>
		</view>
		
		<!-- 底部操作 -->
		<view class="footer d-flex flex-nowrap a-center j-sb bz px-2">
			<view class="footer_list d-flex flex-nowrap a-center">
				<view class="footer_tag">应付</view>
				<view class="footer_price">￥299.00</view>
			</view>
			<view class="pay">去支付</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			navTo(url){
				uni.navigateTo({
					url:url
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.title{
		font-size: 35rpx;
		font-weight: bold;
	}
	.footer{
		height: 64rpx;
		background: #FFFFFF;
		border: 1px solid #D7B073;
		border-radius: 30rpx;
		position:fixed;
		
		left:30rpx;
		right:30rpx;
		bottom:30rpx;
		.footer_tag{
			font-size: 28rpx;
			font-family: SourceHanSansCN;
			font-weight: 400;
			color: #363636;
		}
		.footer_price{
			font-size: 28rpx;
			font-family: SourceHanSansCN;
			font-weight: 400;
			color: #C52525;
		}
		.pay{
			width: 152rpx;
			height: 47rpx;
			text-align: center;
			line-height:45rpx;
			background: #2E4E7E;
			border: 1px solid #2E4E7E;
			border-radius: 23rpx;
			font-size: 26rpx;
			font-family: SourceHanSansCN;
			font-weight: 400;
			color: #FFFFFF;
		}
	}
	.good_list{
		border-bottom: 1rpx solid #f8f8f8;
		.imgs{
			width: 150rpx;
			height: 100rpx;
			border-radius: 15rpx;
		}
		.good_name{
			line-height: 40rpx;
			font-size: 30rpx;
			font-family: SourceHanSansCN;
			font-weight: 400;
			color: #363636;
		}
		.num{
			font-size: 26rpx;
			font-family: SourceHanSansCN;
			font-weight: 400;
			color: #999999;
		}
		.price{
			font-size: 30rpx;
			font-family: SourceHanSansCN;
			font-weight: 400;
			color: #363636;
		}
	}
	.foot{
		font-size: 30rpx;
		font-family: SourceHanSansCN;
		font-weight: bold;
		color: #363636;
		text-align: right;
	}
.top_list{
	height: 50rpx;
	font-size: 28rpx;
	font-family: SourceHanSansCN;
	font-weight: 400;
	color: #363636;
	line-height: 50rpx;
}
.c_right{
	width:45rpx;
	height:45rpx;
}
.des_title{
	font-size: 30rpx;
}
.input{
	font-size: 30rpx;
	text-align: right;
}
</style>
